<template>
	<view>
		<view v-if="!userInfo.wxno" class="no-tips">
			<uv-text color="#3c9cff" prefixIcon="info-circle" text="无需手动操作,每天自动同步朋友圈!"
				:iconStyle="{Color:'#3c9cff',MarginRight:'3px'}"></uv-text>
			<uv-line margin="20rpx 0" color="#68b2ff"></uv-line>
			<view class="no-tips_bottom">
				<view class="tips">
					您还未开启朋友圈车源同步功能</view>
				<uv-button color="#3c9cff" size="small" text="立即开启" @click="tovip"></uv-button>
			</view>

		</view>
		<uv-notice-bar :text="noticetext" bgColor="#fdf6ec" color="#fe9900" direction="column"></uv-notice-bar>
		<view>
			<fy-pyq-item v-for="item in list" :key="item.id" :pyqInfo="item"></fy-pyq-item>
			<uv-load-more :status="status" marginTop="10" marginBottom="10"></uv-load-more>
		</view>
	</view>
</template>

<script>
	import { queryAllPyqInfo, loadUserPyqCountTop } from '@/utils/http.js'
	import baseconfig from '@/config.js'
	import { mapState } from 'vuex'
	export default {
		data() {
			return {

				list: [],
				total: 0,
				noticetext: [],
				queryForm: {
					start: 0,
					length: 10
				},
				status: 'loadmore',
				imgsrc: baseconfig.api_url
			}
		},
		onLoad() {
			this.fetchData()
			this.getpyqTop()
		},
		onReachBottom() {
			this.loadMore()
		},
		computed: {
			...mapState({
				userInfo: state => state.user.userInfo
			})
		},
		onShow() { 
			this.$store.dispatch('socket/updateTabbarBadge')
			
		},
		methods: {
			getpyqTop() {
				loadUserPyqCountTop().then(res => {
					this.noticetext = []
					res.data.forEach(arr => {

						this.noticetext.push(`最近帮[${arr.name}]自动同步${arr.count}条朋友圈车源`)
					})
				})
			},
			tovip() {
				uni.navigateTo({
					url: '/pages/mine/vipPkg'
				})
			},
			todetail(info) {
				const url = '/pages/pyq/detail?items=' +
					encodeURIComponent(JSON.stringify(info))
				uni.navigateTo({ url: url })
			},
			loadMore() {
				if (this.status === 'loadmore') {
					this.queryForm.start = this.queryForm.start + this.queryForm.length
					this.fetchData()
				}

			},
			fetchData() {
				let self = this
				queryAllPyqInfo(this.queryForm).then(res => {
					const { total, rows, count } = res.data
					rows.map(arr => {
						arr.imglist = []
						arr.avatar = baseconfig.api_url + arr.userimgsrc
						if (arr.ipplace) {
							var place = arr.ipplace.split(' ')
							arr.ipplace = place[2]
						} else {
							arr.ipplace = ''
						}

						if (arr.imgsrc) {
							var _list = arr.imgsrc.split(',')
							_list.forEach(imgarr => {
								arr.imglist.push(baseconfig.api_url + imgarr)
							})
						}
						self.list.push(arr)
					})
					self.total = total
					//Object.assign(self.list, rows)
					if ((self.queryForm.start + self.queryForm.length) >= total) {
						self.status = 'nomore'
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.no-tips {
		border: 1px solid #3c9cff;
		background-color: #ecf5ff;
		border-radius: 10upx;
		margin: 20upx;
		padding: 30upx;
			
		&_bottom {
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			
			.tips {
				flex: 1;
				font-size: 26upx;
				color: #555;
			}
			
			._button {
				width: 200upx;
			}
		}

	}
</style>